// import { notification } from "element-ui";
import { Toast } from "vant";

const requireContext = require.context('../assets/images', true, /^\.\/.*\.png$/)// 通过webpack 获取 img
export const get_img_url_by_name = (name) => {
    if(!name){
        return
    }
    let id = requireContext.resolve(`./${name}.png`);

    return __webpack_require__(id);
}

// 获取优化后的 nickName
export const get_nickname = (member) => {
  const get_spliced_name = (name) => {
    let before_username = name.slice(0, 4); //优化成较短的显示
    let after_username = name.slice(-4);

    return before_username + "****" + after_username;
  };

  let nick_name = undefined;

  if (!member.nickName || member.nickName.split("_")[1]) {
    // 没有 nickName 或者 nickName 是username 裁剪 username
    let name = member.name.split("_")[1];
    nick_name = get_spliced_name(name);
    return nick_name;
  }

  if (member.nickName.length < 15) {
    nick_name = member.nickName;
    return nick_name;
  }

  nick_name = get_spliced_name(member.nickName); //过长的裁剪
  return nick_name;
};

export const getPageQuery = (query) => {
  // 从url获取参数
  if (!query) {
    return "";
  }

  let search = window.location.href.split("?")[1];

  if (!search) {
    return "";
  }

  let query_value = "";

  let key_value_arr = search.split("&");
  key_value_arr.map((item) => {
    let key = item.split("=")[0];
    let value = item.split("=")[1];

    if (query == key) {
      query_value = value;
    }
  });

  return decodeURI(query_value);
};

export const toast_msg_show = (text) => {
  let el_m = document.createElement("div");
  el_m.id = "toast-msg"; // 只能有一个
  el_m.innerText = text;
  document.body.appendChild(el_m);

  setTimeout(() => {
    if (document.querySelector("#toast-msg")) {
      document.body.removeChild(document.querySelector("#toast-msg"));
    }
  }, 2000);
};

export const notification_show = function (type, message) {
  // notification[type]({
  //   message,
  //   placement: "bottomRight",
  //   className: "openNotification",
  //   // duration: 50000
  // });

  let messageType = type;
  if (type == "error") messageType = "fail";
  Toast({
    type: messageType,
    message,
  });
};

export const _set_config_to_localStorage = ({ nickName, audio, video }) => {
  // 将昵称、音频开启状态、视频开启状态 存储起来
  let config = {
    nickName,
    audio,
    video,
  };

  window.localStorage.setItem("em-meeting-config", JSON.stringify(config));
};

// get loading el
export const _get_video_loading_el = () => {
  let el = document.createElement("div");
  el.classList.add("loading-wrapper");

  let children = [
    `<div class="loading">
                <div class="circle circle1">
                    <span></span>
                    <span></span>
                    <span></span>
                    <span></span>
                </div>
                <div class="circle circle2">
                    <span></span>
                    <span></span>
                    <span></span>
                    <span></span>
                </div>
                <div class="circle circle3">
                    <span></span>
                    <span></span>
                    <span></span>
                    <span></span>
                </div>
            </div>`,
  ];

  el.innerHTML = children;
  return el;
};

// 获取会议时间
export const _get_tick = (time) => {
  function get_second(second) {
    return second < 10 ? "0" + second : second;
  }
  function get_minute(minute) {
    return minute < 10 ? "0" + minute : minute;
  }
  let time_str = "";
  if (time < 60) {
    time_str = "00:" + get_second(time);
  } else if (time >= 60) {
    let minute = get_minute(parseInt(time / 60));
    let surplus_second = get_second(time % 60);
    time_str = minute + ":" + surplus_second;
  }
  return time_str;
};

// 主播列表内主播是否可见
export const talker_is_not_visble = (element) => {
  let body_height = document.body.getBoundingClientRect().height;
  let el_height = document.querySelectorAll(".talker-list-wrapper .v-wrapper")[0].getBoundingClientRect().height;
  let footer_height = document.querySelector("footer").getBoundingClientRect().height;

  let top = element.getBoundingClientRect().top;

  if (top >= body_height - footer_height) {
    // top 比(容器 - 底部栏高度 )还高，说明在容器下面
    return true;
  }

  // 在上面 往上滑 125：是第一个可见的 video 的位置 滑出去了看不见了
  if (top < 125 && Math.abs(top - 125) > el_height) {
    return true;
  }

  return false; // 介于 125 ~ boby_height 之间的为可见
};

export const move_v_els = (subed_v_els) => {
  // 通过原生 js， 移动 DOM 节点
  let v_wrappers = document.querySelectorAll(".v-wrapper[sid]");

  for (let index = 0; index < v_wrappers.length; index++) {
    const v_wrapper = v_wrappers[index];

    let sId = v_wrapper.getAttribute("sid");
    let v_el = subed_v_els[sId];

    let prev_v_el = v_wrapper.querySelector("video");
    prev_v_el ? v_wrapper.removeChild(prev_v_el) : ""; // 先删除

    v_wrapper.appendChild(v_el);
  }
};
